<!-- 商品产品 -->
<template>
  <div class="products5">
    <div class="container">
      <!-- 标题 -->
      <div class="title">
        <h3>商用产品</h3>
      </div>

      <div class="products-item">
        <!-- 左边推荐图 -->
        <div class="left-img" @click="jump">
          <img
            src="https://www.tp-linkshop.com.cn/Content/themes/base/images/Home/smb_left.jpg"
            alt=""
          />
        </div>
        <!-- 引入公共布局样式 -->
        <ComBox :classid="806"></ComBox>
      </div>
    </div>
  </div>
</template>

<script>
import ComBox from "@/components/index/main/ComBox.vue";

export default {
  components: {
    ComBox,
  },
  methods: {
    // 点击商品跳转
    jump() {
      this.$router.push({
        path: "/detail",
        query: {
          id: 1595,
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.products5 {
  width: 100%;
  min-width: 1200px;
  margin-top: 40px;
  .container {
    .title {
      width: 100%;
      height: 48px;
      h3 {
        color: #333;
        float: left;
        font-weight: 400;
        font-size: 24px;
        line-height: 24px;
      }
    }
    .products-item {
      width: 100%;
      margin: 16px 0 0;
      overflow: visible;
      height: 624px;
      .left-img {
        width: 230px;
        height: 612px;
        cursor: pointer;
        float: left;
      }
    }
  }
}
</style>
